<div nz-row [nzGutter]="8">
  <div nz-col nzSpan="8">
    <g2-card [title]="'巡检任务'" [bordered]="true" total="{{deviceInspectionTask}}" [avatar]="avatar" [action]="inspection_task" [contentHeight]="26">
      <ng-template #avatar></ng-template>
      <ng-template #inspection_task>
        <i nz-tooltip nzTooltipTitle="本月的巡检任务" nz-icon nzType="info-circle"></i>
      </ng-template>
    </g2-card>
  </div>

  <div nz-col nzSpan="8">
    <g2-card [title]="'保养任务'" [bordered]="true" total="{{deviceMaintainTask}}" [avatar]="avatar" [action]="maintain_task" [contentHeight]="26">
      <ng-template #avatar></ng-template>
      <ng-template #maintain_task>
        <i nz-tooltip nzTooltipTitle="本月的保养任务" nz-icon nzType="info-circle"></i>
      </ng-template>
    </g2-card>
  </div>

  <div nz-col nzSpan="8">
    <g2-card [title]="'我的待办'" [bordered]="true" [total]="'15'" [avatar]="avatar" [action]="self" [contentHeight]="26">
      <ng-template #avatar></ng-template>
      <ng-template #self>
        <i nz-tooltip nzTooltipTitle="我的所有待办任务" nz-icon nzType="info-circle"></i>
      </ng-template>
      设备巡检
      <trend flag="up" style="margin: 0 16px 0 8px; color: rgba(0,0,0,.85)">12%</trend>
      设备保养
      <trend flag="down" style="margin: 0 0 0 8px; color: rgba(0,0,0,.85)">11%</trend>

    </g2-card>
  </div>
</div>


<nz-card>
  <g2-timeline

    [data]="chartData"
    [titleMap]="{ y1: '任务数量', y2: '完成数量' }"
    [height]="326"
  ></g2-timeline>
</nz-card>


